// main.qml
// QComboBox 适配到 Qt for HarmonyOS
import QtQuick 2.15
import QtQuick.Controls 1.2 as Controls1
import QtQuick.Controls 2.15
import QtQuick.Window 2.15

ApplicationWindow {
    id: root
    width: Screen.width > 0 ? Screen.width : 1260
    height: Screen.height > 0 ? Screen.height : 2720
    visible: true
    title: "QComboBox"
    flags: Qt.Window | Qt.WindowTitleHint | Qt.WindowSystemMenuHint | Qt.WindowMinMaxButtonsHint | Qt.WindowCloseButtonHint
    
    // 城市数据模型 - 对应原始代码中的 citylist
    ListModel {
        id: cityListModel
        
        // 四川的城市
        ListElement { provinceIndex: 0; cityName: "成都市" }
        ListElement { provinceIndex: 0; cityName: "自贡市" }
        ListElement { provinceIndex: 0; cityName: "攀枝花市" }
        ListElement { provinceIndex: 0; cityName: "泸州市" }
        
        // 陕西的城市
        ListElement { provinceIndex: 1; cityName: "西安" }
        ListElement { provinceIndex: 1; cityName: "咸阳" }
        ListElement { provinceIndex: 1; cityName: "汉中" }
        ListElement { provinceIndex: 1; cityName: "渭南" }
        ListElement { provinceIndex: 1; cityName: "延安" }
        
        // 浙江的城市
        ListElement { provinceIndex: 2; cityName: "杭州市" }
        ListElement { provinceIndex: 2; cityName: "宁波市" }
        ListElement { provinceIndex: 2; cityName: "温州市" }
        ListElement { provinceIndex: 2; cityName: "嘉兴市" }
    }
    
    // 省份列表
    property var provinceList: ["四川", "陕西", "浙江"]
    
    // 当前选中的省份索引
    property int currentProvinceIndex: 0
    
    // 当前城市列表（根据省份动态更新）
    property var currentCityList: []
    
    // 姓名输入
    property string nameText: ""
    
    // 结果文本
    property string resultText: ""
    
    // 初始化城市列表
    Component.onCompleted: {
        console.log("QComboBox: ApplicationWindow onCompleted")
        // 延迟执行，确保所有组件都已创建
        Qt.callLater(function() {
            updateCityList()
        })
    }
    
    // 更新城市列表函数
    function updateCityList() {
        console.log("QComboBox: updateCityList, currentProvinceIndex:", currentProvinceIndex)
        try {
            var cities = []
            for (var i = 0; i < cityListModel.count; i++) {
                var item = cityListModel.get(i)
                if (item && item.provinceIndex === currentProvinceIndex) {
                    cities.push(item.cityName)
                }
            }
            currentCityList = cities
            console.log("QComboBox: cities:", cities)
            // 更新 ComboBox 的 model
            if (cityComboBox) {
                cityComboBox.model = currentCityList
                // 重置城市选择为第一个
                if (currentCityList.length > 0) {
                    cityComboBox.currentIndex = 0
                } else {
                    cityComboBox.currentIndex = -1
                }
            }
        } catch (e) {
            console.error("QComboBox: updateCityList error:", e)
        }
    }
    
    // 获取结果
    function getResult() {
        try {
            var name = nameText || ""
            var province = (provinceList && provinceList.length > currentProvinceIndex)
                           ? provinceList[currentProvinceIndex]
                           : ""
            var city = ""
            if (cityComboBox && cityComboBox.currentIndex >= 0) {
                // Controls 2.15 ComboBox 使用 currentText 属性
                city = cityComboBox.currentText || ""
                if (!city && currentCityList && cityComboBox.currentIndex < currentCityList.length) {
                    city = currentCityList[cityComboBox.currentIndex]
                }
            }
            resultText = "姓名:" + name + " 省份:" + province + " 城市:" + city
            console.log("QComboBox: resultText:", resultText)
        } catch (e) {
            console.error("QComboBox: getResult error:", e)
        }
    }
    
    // 清空结果
    function clearResult() {
        resultText = ""
        console.log("QComboBox: Clear按钮被点击")
    }
    
    Rectangle {
        id: contentRect
        anchors.fill: parent
        color: "#F5F5F5"
        
        Column {
            anchors.fill: parent
            anchors.margins: 50
            spacing: 40
            
            // 姓名输入行
            Row {
                width: parent.width
                spacing: 30
                
                Text {
                    text: "姓名"
                    width: 150
                    height: 100
                    verticalAlignment: Text.AlignVCenter
                    font.pixelSize: 40
                }
                
                Rectangle {
                    width: parent.width - 180
                    height: 100
                    border.color: nameInput.activeFocus ? "#0078D4" : "#CCCCCC"
                    border.width: 3
                    color: "white"
                    radius: 8
                    z: 1
                    
                    MouseArea {
                        anchors.fill: parent
                        acceptedButtons: Qt.LeftButton
                        onClicked: {
                            nameInput.forceActiveFocus()
                            mouse.accepted = true
                        }
                    }
                    
                    TextInput {
                        id: nameInput
                        anchors.fill: parent
                        anchors.margins: 16
                        verticalAlignment: TextInput.AlignVCenter
                        font.pixelSize: 40
                        selectByMouse: true
                        enabled: true
                        activeFocusOnPress: true
                        onActiveFocusChanged: {
                            console.log("QComboBox: nameInput focus changed:", activeFocus)
                        }
                        onTextChanged: {
                            nameText = text
                        }
                    }
                }
            }
            
            // 省份选择行
            Row {
                width: parent.width
                spacing: 30
                
                Text {
                    text: "省份"
                    width: 150
                    height: 100
                    verticalAlignment: Text.AlignVCenter
                    font.pixelSize: 40
                }
                
                ComboBox {
                    id: provinceComboBox
                    width: parent.width - 180
                    height: 100
                    model: provinceList
                    enabled: true
                    font.pixelSize: 40
                    z: 10
                    hoverEnabled: true
                    // focusPolicy: Qt.StrongFocus  // 移除，使用默认焦点策略
                    
                    popup.onAboutToShow: {
                        console.log("QComboBox: provinceComboBox popup about to show")
                    }
                    
                    popup.onAboutToHide: {
                        console.log("QComboBox: provinceComboBox popup about to hide")
                    }
                    
                    delegate: ItemDelegate {
                        width: provinceComboBox.width
                        text: modelData
                        font.pixelSize: 40
                        highlighted: provinceComboBox.highlightedIndex === index
                    }
                    
                    // ⚠️ 注意：不要使用 MouseArea 覆盖 ComboBox！
                    // ComboBox 控件本身已经有内置的鼠标/触摸处理机制
                    // 添加 MouseArea 会拦截事件，导致无法正常交互
                    
                    Component.onCompleted: {
                        currentIndex = 0
                        console.log("QComboBox: provinceComboBox initialized, model count:", provinceList.length)
                    }
                    
                    onCurrentIndexChanged: {
                        console.log("QComboBox: provinceComboBox currentIndex changed to:", currentIndex)
                        if (currentIndex >= 0) {
                            console.log("QComboBox: province changed to:", currentIndex)
                            currentProvinceIndex = currentIndex
                            updateCityList()
                        }
                    }
                    
                    onActivated: {
                        console.log("QComboBox: provinceComboBox activated, index:", currentIndex)
                    }
                }
            }
            
            // 城市选择行
            Row {
                width: parent.width
                spacing: 30
                
                Text {
                    text: "城市"
                    width: 150
                    height: 100
                    verticalAlignment: Text.AlignVCenter
                    font.pixelSize: 40
                }
                
                ComboBox {
                    id: cityComboBox
                    width: parent.width - 180
                    height: 100
                    model: currentCityList
                    enabled: true
                    font.pixelSize: 40
                    z: 10
                    hoverEnabled: true
                    // focusPolicy: Qt.StrongFocus  // 移除，使用默认焦点策略
                    
                    popup.onAboutToShow: {
                        console.log("QComboBox: cityComboBox popup about to show")
                    }
                    
                    popup.onAboutToHide: {
                        console.log("QComboBox: cityComboBox popup about to hide")
                    }
                    
                    delegate: ItemDelegate {
                        width: cityComboBox.width
                        text: modelData
                        font.pixelSize: 40
                        highlighted: cityComboBox.highlightedIndex === index
                    }
                    
                    // ⚠️ 注意：不要使用 MouseArea 覆盖 ComboBox！
                    // ComboBox 控件本身已经有内置的鼠标/触摸处理机制
                    // 添加 MouseArea 会拦截事件，导致无法正常交互
                    
                    Component.onCompleted: {
                        console.log("QComboBox: cityComboBox initialized, model count:", currentCityList.length)
                    }
                    
                    onCurrentIndexChanged: {
                        console.log("QComboBox: cityComboBox currentIndex changed to:", currentIndex)
                    }
                    
                    onActivated: {
                        console.log("QComboBox: cityComboBox activated, index:", currentIndex)
                    }
                }
            }
            
            // 分隔线
            Rectangle {
                width: parent.width
                height: 3
                color: "#CCCCCC"
            }
            
            // 按钮行
            Row {
                width: parent.width
                spacing: 40
                anchors.horizontalCenter: parent.horizontalCenter
                z: 0
                
                Button {
                    text: "确定"
                    width: 200
                    height: 80
                    font.pixelSize: 32
                    enabled: true
                    focusPolicy: Qt.NoFocus
                    hoverEnabled: false
                    
                    onClicked: {
                        console.log("QComboBox: 确定按钮被点击")
                        getResult()
                    }
                }
                
                Button {
                    text: "Clear"
                    width: 200
                    height: 80
                    font.pixelSize: 32
                    enabled: true
                    focusPolicy: Qt.NoFocus
                    hoverEnabled: false
                    
                    onClicked: {
                        console.log("QComboBox: Clear按钮被点击")
                        clearResult()
                    }
                }
            }
            
            // 结果显示行
            Row {
                width: parent.width
                spacing: 30
                
                Text {
                    text: "结果"
                    width: 150
                    height: 100
                    verticalAlignment: Text.AlignVCenter
                    font.pixelSize: 40
                }
                
                Rectangle {
                    width: parent.width - 180
                    height: 100
                    border.color: "#CCCCCC"
                    border.width: 3
                    color: "white"
                    radius: 8
                    
                    Text {
                        id: resultDisplay
                        anchors.fill: parent
                        anchors.margins: 16
                        verticalAlignment: Text.AlignVCenter
                        font.pixelSize: 40
                        text: resultText
                        color: "#333333"
                    }
                }
            }
        }
    }
}
